
.be-popover{
  position: fixed;
  background-color: $default;
  border-radius: 3px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.26);
  .be-popover-body{
    color: $info;
    text-align: center;
    padding: 8px 14px;
    box-sizing: border-box;
    font-size: 12px;
  }
  .be-popover-arrow,
  .be-popover-arrow::before {
    position: absolute;
    width: 8px;
    height: 8px;
    background: inherit;
  }

  .be-popover-arrow {
    visibility: hidden;
  }

  .be-popover-arrow::before {
    visibility: visible;
    content: '';
    transform: rotate(45deg);
  }

}

.be-popover[data-popper-placement^='top']{
  .be-popover-arrow {
    bottom: -4px;
  }
}

.be-popover[data-popper-placement^='bottom'] {
  .be-popover-arrow {
    top: -4px;
  }
}
.be-popover[data-popper-placement^='left'] {
  .be-popover-arrow {
    right: -4px;
  }
}
.be-popover[data-popper-placement^='right'] {
  .be-popover-arrow {
    left: -4px;
  }
}